<template>
	<view>
		<view class="header">
			<view class="icon-view" @click="$utils.navigateBack(1)"><u-icon name="arrow-left" color="#fff" size="40"></u-icon></view>
		</view>
		<view class="main">
			<view class="banner">
				<image mode="widthFix" src="/static/images/activity/description-title.png" class="title"></image>
				<view class="title2">{{huodong.hd_riqi}}</view>
				<image mode="widthFix" src="/static/images/activity/description-title2.png" class="title3"></image>
			</view>
			<view class="content-view">
				<image mode="widthFix" src="/static/images/activity/description-content-bg1.png" class="block-img"></image>
				<view class="content">
					<view class="content-title">活动时间</view>
					<view class="content-txt u-text-center red">{{huodong.hd_riqi}}</view>
					<view class="content-title">活动对象</view>
					<view class="content-txt">
						<view class="txt-list" v-if="huodong.hd_duixiang1">
							<view class="txt-number">1</view>
							<view class="txt-right">{{huodong.hd_duixiang1}}</view>
						</view>
						<view class="txt-list" v-if="huodong.hd_duixiang2">
							<view class="txt-number">2</view>
							<view class="txt-right">{{huodong.hd_duixiang2}}</view>
						</view>
						<view class="txt-list" v-if="huodong.hd_duixiang3">
							<view class="txt-number">3</view>
							<view class="txt-right">{{huodong.hd_duixiang3}}</view>
						</view>
						 
					</view>
					<view class="content-title">活动内容</view>
					<view class="content-txt">
						{{huodong.hd_neirong}}
					</view>
				</view>
				<image mode="widthFix" src="/static/images/activity/description-content-bg3.png" class="block-img"></image>
			</view>
			<image mode="widthFix" src="/static/images/activity/description-bg2.jpg" class="block-img"></image>
		</view>
		<view class="footer-view">
			
		</view>
	</view>
</template>		
 	
<script>
	 
export default {
	data() {
		return {
			huodong:{}
		}
	},
	onLoad(option) {
		this.getdata();
	},
	 
	methods: {
		getdata:function(){
			uni.request({
				url: 'http://www.txzh.com.cn/api.php?app=Default&act=hdxq',  
				method: 'POST',
				header: {
					'Content-Type': 'application/x-www-form-urlencoded',
					'X-Requested-With': 'xmlhttprequest'
				},
				data:{
					token:this.$store.state.app.token,
				},
				success: res => {
					console.log(res)
					this.huodong = res.data.list.huodong;
					/*
					uni.showToast({
						title: '修改成功',
						icon:'none'
					})
					*/
				},  
				fail: () => {},  
				complete: () => {}  
			});  
		},
		
		 
		
	}
}
</script>

<style>
page{
	background: #fb3f35;
}
</style>
<style lang="scss" scoped>
.header{
	position:absolute;
	top:65rpx;
	left:0;
	z-index: 1;
	width:100%;
	padding:0 30rpx;
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	.icon-view{
		width:65rpx;
		height:65rpx;
		background: rgba(0,0,0,.3);
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 40rpx;
	}
}
.block-img{
	width: 100%;
	display: block;
}
.main{
	background: url(../../static/images/activity/description-bg.jpg) no-repeat;
	background-size: 100% auto;
	.banner{
		width:80%;
		margin:0 auto;
		text-align: center;
		.title{
			margin-top:150rpx;
			width:100%;
		}
		.title2{
			margin-top:20rpx;
			color:#fff;
			text-align: center;
			font-size:40rpx;
			font-weight: bold;
		}
		.title3{
			margin-top:30rpx;
			width:80%;
		}
	}
	.content-view{
		width:80%;
		margin: 50rpx auto 70rpx;
		.content{
			background: url(../../static/images/activity/description-content-bg2.png) repeat-y;
			background-size: 100% auto;
			padding:10rpx 50rpx;
			.content-title{
				height:60rpx;
				line-height:60rpx;
				background: url(../../static/images/activity/description-title-bg.png) no-repeat center top;
				background-size: auto 100%;
				text-align: center;
				color:#fff;
				font-size:30rpx;
			}
			.content-txt{
				padding:20rpx 0 30rpx;
				line-height:1.6em;
				.txt-list{
					margin-bottom:12rpx;
					.txt-number{
						float:left;
						width:35rpx;
						height:35rpx;
						line-height:40rpx;
						margin-top:5rpx;
						color:#fff;
						background: #c8352c;
						border-radius: 50%;
						text-align: center;
					}
					.txt-right{
						margin-left:45rpx;
					}
				}
			}
		}
	}
}
</style>